import * as  React from 'react';
import {Component} from "react";


/*
* 1. Props 和 State 可以验证props类型和 state类型
* 2. 提示传值方 不会报错
*
* */

interface Props {
  password: string;
}

interface State {
  current: number;
  username: string
}

// 在类组件中使用props或者 state进行类型检测  : 泛型
class ClassTs extends Component<Props, State> {
  constructor(props) {
    super(props);
    this.state = {
      current: 1,
      username: 'user'
    };

  }

  // 函数 中写ts
  clickP() {
    let arr: object[];
    arr.push({a: 123})
  }


  render() {
    let {username, current} = this.state;
    let {password} = this.props;
    return (
      <div>
        <p>{username}</p>
        <p>{current}</p>
        <p onClick={this.clickP.bind(this)}>{password}</p>
      </div>
    );
  }
}

export default ClassTs;
